﻿require("react-hot-loader/patch")
import React, { Component} from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import * as actions from '../../actions/actions';
import '../../less/style.less';
import DataList from '../common/dataList.js';
const queryString = require('query-string');
import * as api from "../../api.js"
import {createHashHistory} from 'history'
const history = createHashHistory()

import * as weapon from '../../utils/weapon.js';

const columns = [{
		title: '姓名',
		dataIndex: 'name',
	}, {
		title: 'QQ',
		dataIndex: 'qq',
	}, {
		title: '手机',
		dataIndex: 'phone',
	},
	{
		title:"更新时间",
		dataIndex:"updateTime"
	}
];

class TableTest extends Component {
	constructor(props) {
		super(props);
		this.state={
			pageSize:10,
			pageNumber:1
		}
	}
	componentWillReceiveProps(nextProp){
		var search = Object.assign({},queryString.parse(nextProp.location.search));
		const {location,dispatch}=this.props;
		var current = queryString.parse(location.search);
		var pageParams=Object.assign({pageNumber:1,pageSize:10},search)
		if(search.pageSize==undefined && search.pageNumber==undefined){//如果
			history.replace("/table-test?pageNumber=1&pageSize=10")
		}else{
			if(search.pageNumber!=current.pageNumber || search.pageSize!=current.pageSize){
				dispatch.tableTest_refresh({pageNumber:search.pageNumber,pageSize:search.pageSize});
				this.setState(search);
			}
		}
	}
	componentDidMount(){
		const {dispatch}=this.props;
		const {pageNumber,pageSize}=this.state;
		dispatch.tableTest_refresh({pageNumber:pageNumber,pageSize:pageSize});
		console.log(this.refs.test);
	}
	render() {
		const {dataSource}=this.props;
		const {defaultCurrent,pageNumber,pageSize}=this.state;
		return (
			<div className="table-test">
				<DataList columns={columns} 
				defaultCurrent={defaultCurrent}
				current={weapon.strToNum(pageNumber)}
				pageSize={pageSize}
				total={dataSource.total}
				loading={dataSource.loading}
				dataSource={dataSource.data.list}>
				ref="test"
				</DataList>
			</div>
		)
	}
}

function mapStateToProps(state) {
	return {
		dataSource: state.tableTest
	}
}
function mapDispatchToProps(dispatch) {
	return {
		dispatch:bindActionCreators(actions, dispatch)
	}
}

export default connect(
	mapStateToProps,
	mapDispatchToProps
)(TableTest)
